{% extends 'base.html' %}
<html lang="pt-br"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
{% block menu %}
         <div class="nav-collapse collapse">
            <p class="navbar-text pull-right">
              
            
              
            </p>
          
            <ul class="nav">
              <li><a href="/" id="id_link_home"> Home</a></li>
              <li class="active" id="id_link_about"> <a href="/projetos" >Projetos</a></li>
             <li><a href="/equipamentos" id="id_link_about">Equipamentos</a></li>
            </ul>
          
          </div><!--/.nav-collapse -->
          	{% endblock %}
{% block corpo %}

<div class="page-header">
  <form action="/verprojeto?id={{ projeto.id }}" method="post" class="form-inline">
{% for field in formulario.visible_fields %}

 {% if field.errors %} {% endif %}
    
    
        {% for err in field.errors %} 
         {{ err }} 
         
        {% endfor %}
        
        {{ field.label_tag }}
         {{ field }}
    
{% endfor %}




<button class="btn btn-small btn-default"><i class="icon-ok"></i></button>
</form>
  
  
<h1><small>{{ projeto.nome }}</small></h1>



	  
	</div>








{% if itens %}


<table id="list_items_table" class="table table-hover">
 <thead>
            <tr>
                <th class="span5">Equipamento</th>
                <th class="span3" style="text-align: left;">Custo Mensal p/ equipamento</th>
                <th class="span3" style="text-align: center;">Quantidade</th>
                 <th class="span2" style="text-align: center;">Qtde interfaces</th>
                <th class="span2" style="text-align: center;">Valor p/ Equipamento</th>
                <th class="span2" style="text-align: center;">Memoria</th>
                <th class="span2" style="text-align: center;">Qtde Discos</th>
                <th class="span2" style="text-align: center;">Tipo de Discos</th>
                <th class="span2" style="text-align: center;">Componente</th>
                <th class="span2" style="text-align: center;">Pool</th>
                
               
                
            </tr>
        </thead>
        <tbody>
{% for i in itens %}


        
        
            <tr>
                <td class="span5">
                    <input id="item_{{ i.id}}" name="item_{{ i.id}}" type="text" value="" placeholder="Item" class="input-large" style="display: none;">
                    
                        <label id="label_item_{{ i.id}}">
                        {{ i.tipoitem }}
                        </label>
                    
                </td>
                   <td class="span2" style="text-align: center;">
                    <div id="div_valormensal_{{ i.id}}" class="input-prepend" style="display: none;">
                        <span class="add-on">R$</span>
                        <input id="valormensal_{{ i.id}}" name="valormensal_{{ i.id}}" type="text" value="" placeholder="Valor" class="real_currency input-mini">
                    </div>
                    <label id="label_valormensal_{{ i.id}}">
                    {{ i.getcustomensalitem|stringformat:"1.2f"|cut:"-" }}
                        
                      
                        
                    </label>
                </td>
                
                <td class="span3" style="text-align: center;">
                    <input id="quantidade_{{ i.id}}" name="quantidade_{{ i.id}}" type="text" value="" placeholder="Qtde" class="qtde input-mini" style="display: none;">
                    <label id="label_quantidade_{{ i.id}}">
               {{ i.quantidade }}
                    </label>
                </td>
                <td class="span3" style="text-align: center;">
                    <input id="interfaces_{{ i.id}}" name="interfaces_{{ i.id}}" type="text" value="" placeholder="Qtde" class="interfaces input-mini" style="display: none;">
                    <label id="label_interfaces_{{ i.id}}">
               {{ i.numinterfaces }}
                    </label>
                </td>
                <td class="span2" style="text-align: center;">
                    <div id="div_valor_{{ i.id}}" class="input-prepend" style="display: none;">
                        <span class="add-on">R$</span>
                        <input id="valor_{{ i.id}}" name="valor_{{ i.id}}" type="text" value="" placeholder="Valor" class="real_currency input-mini">
                    </div>
                    <label id="label_valor_{{ i.id}}">
                        
                        {{ i.valor|stringformat:"1.2f"|cut:"-" }}
                        
                    </label>
                </td>
                 <td class="span3" style="text-align: center;">
                    <input id="qtdmemory_{{ i.id}}" name="qtdmemory_{{ i.id}}" type="text" value="" placeholder="Qtde" class="memory input-mini" style="display: none;">
                    <label id="label_qtdmemory_{{ i.id}}">
               {{ i.qtdmemory}}
                    </label>
                </td>
                 <td class="span3" style="text-align: center;">
                    <input id="qtddiscos_{{ i.id}}" name="qtddiscos_{{ i.id}}" type="text" value="" placeholder="Qtde" class="qtdediscos input-mini" style="display: none;">
                    <label id="label_qtddiscos_{{ i.id}}">
               {{ i.qtddiscos }}
                    </label>
                </td>
                
                 <td class="span3" style="text-align: center;">
                    <input id="disco_{{ i.id}}" name="disco_{{ i.id}}" type="text" value="" placeholder="Discos" class="disco input-mini" style="display: none;">
                    <label id="label_disco_{{ i.id}}">
               {{ i.disco }}
                    </label>
                </td>
                <td class="span3" style="text-align: center;">
                    <input id="componente_{{ i.id }}" name="componente_{{ i.id }}" type="text" value="" placeholder="" class="componente input-mini" style="display: none;">
                    <label id="label_componente_{{ i.id }}">
               {{ i.componente}}
                    </label>
                </td>
                <td class="span3" style="text-align: center;">
                    <input id="pool_{{ i.id }}" name="pool_{{ i.id }}" type="text" value="" placeholder="" class="pool input-mini" style="display: none;">
                    <label id="label_pool_{{ i.id }}">
               {{ i.pool}}
                    </label>
                </td>
                
             
             
                <td class="span2" style="text-align: center;">
                    <div id="edit_buttons_{{ i.id}}">
                        <button class="btn" onclick="editButton({{ i.id}});"><i class="icon-edit"></i></button>
                        <button class="btn" onclick="removeButton({{ i.id}});"><i class="icon-trash"></i></button>
                    </div>
                    <div id="update_buttons_{{ i.id}}" style="display: none">
                        <button class="btn" onclick="updateButton({{ i.id}});"><i class="icon-ok"></i></button>
                        <button class="btn" onclick="cancelButton({{ i.id}});"><i class="icon-stop"></i></button>
                    </div>
                </td>
                
                
            </tr>
        
  











{% endfor %}

    </tbody>
    <tr>
     
      </tr>
    
    
    <tfoot>
     <tr>
    			 
                <th class="span5">Total</th>
                <th class="span3" style="text-align: left;"> R$ {{ CustoMensalTotal|stringformat:"1.2f"|cut:"-"}}  </th>
                <th class="span3" style="text-align: center;"> {{  QuantidadeTotal }} </th>
                <th class="span2" style="text-align: center;"> {{ TotalInterfaces }} </th>
                <th class="span2" style="text-align: center;">R$ {{ TotalEquipamentos|stringformat:"1.2f"|cut:"-" }} </th>
                
                <th class="span2" style="text-align: center;"> {{ MemoriaTotal }} </th>
                <th class="span2" style="text-align: center;">{{ TotalDiscos }} </th>
                <th class="span2" style="text-align: center;"></th>
                
                
                
            </tr>
    </tfoot>
    </table>
    
                    
                   <td class="span6">



                   <a class="btn btn-small btn-primary" href="/createcsv?id={{projeto.id}}"> csv </a>
                </td>
{% endif %}


<script src="/templates/bootstrap/js/jquery.min.js" type="text/javascript"></script>
    <script src="/templates/bootstrap/bootstrap-modal.js"></script>
    <script src="/templates/bootstrap/bootstrap-dropdown.js"></script>
    <script src="/templates/bootstrap/bootstrap-transition.js"></script>
    <script src="/templates/bootstrap/bootstrap-alert.js"></script>
    <script src="/templates/bootstrap/bootstrap-scrollspy.js"></script>
    <script src="/templates/bootstrap/bootstrap-tab.js"></script>
    <script src="/templates/bootstrap/bootstrap-tooltip.js"></script>
    <script src="/templates/bootstrap/bootstrap-popover.js"></script>
    <script src="/templates/bootstrap/bootstrap-button.js"></script>
    <script src="/templates/bootstrap/bootstrap-collapse.js"></script>
    <script src="/templates/bootstrap/bootstrap-carousel.js"></script>
    <script src="/templates/bootstrap/bootstrap-typeahead.js"></script>
    <script src="/templates/bootstrap/js/jquery.mask.js"></script>
    <script src="/templates/bootstrap/js/jquery.maskMoney.js"></script>
    <script src="/templates/bootstrap/shoplist_admin.js"></script>

    
     <script type="text/javascript">
    
    function itemButton(item_id)
    {
        var item_name = $("#label_item_"+item_id).text().trim();
        var uri = '/search_item_offers/?item=' + encodeURIComponent(item_name);
        $('#itemModal').modal('show');
        $('.modal-body').html('&nbsp;').load(uri);
    }

    $( document ).ajaxStart( function() {
        $('#spinner').show();
    }).ajaxStop( function() {
        $('#spinner').hide();
    });

    function editButton(item_id)
    {
       
    	$("#label_item_"+item_id).show();
    	$("#item_"+item_id).val($("#label_item_"+item_id).text().trim());
        
    	
    	$("#label_quantidade_"+item_id).hide();
        $("#quantidade_"+item_id).show();
        $("#quantidade_"+item_id).val($("#label_quantidade_"+item_id).text().trim());
        
        $("#label_qtdmemory_"+item_id).hide();
        $("#qtdmemory_"+item_id).show();
        $("#qtdmemory_"+item_id).val($("#label_qtdmemory_"+item_id).text().trim());
        
        $("#label_qtddiscos_"+item_id).hide();
        $("#qtddiscos_"+item_id).show();
        $("#qtddiscos_"+item_id).val($("#label_qtddiscos_"+item_id).text().trim());
        
        $("#label_disco_"+item_id).hide();
        $("#disco_"+item_id).show();
        $("#disco_"+item_id).val($("#label_disco_"+item_id).text().trim());
        
        $("#label_interfaces_"+item_id).hide();
        $("#interfaces_"+item_id).show();
        $("#interfaces_"+item_id).val($("#label_interfaces_"+item_id).text().trim());
        
        $("#label_componente_"+item_id).hide();
        $("#componente_"+item_id).show();
        $("#componente_"+item_id).val($("#label_componente_"+item_id).text().trim());
        
        $("#label_pool_"+item_id).hide();
        $("#pool_"+item_id).show();
        $("#pool_"+item_id).val($("#label_pool_"+item_id).text().trim());
        
        $("#label_valor_"+item_id).hide();
        $("#div_valor_"+item_id).show();
        var pc = $("#label_valor_"+item_id).text().trim();
        pc = pc.replace("R$ ", "");
       
        $("#valor_"+item_id).val(pc);
        $("#edit_buttons_"+item_id).hide();
        $("#update_buttons_"+item_id).show();
    }

    function cancelButton(item_id)
    {
        $("#label_item_"+item_id).show();
        $("#item_"+item_id).hide();
        
        $("#label_qtdmemory_"+item_id).show();
        $("#qtdmemory_"+item_id).hide();
        
        $("#label_qtddiscos_"+item_id).show();
        $("#qtddiscos_"+item_id).hide();
        
        $("#label_disco_"+item_id).show();
        $("#disco_"+item_id).hide();
        
        $("#label_quantidade_"+item_id).show();
        $("#quantidade_"+item_id).hide();
        $("#label_interfaces_"+item_id).show();
        $("#interfaces_"+item_id).hide();
        $("#label_componente_"+item_id).show();
        $("#componente_"+item_id).hide();
        
        $("#label_pool_"+item_id).show();
        $("#pool_"+item_id).hide();
        
        $("#label_valor_"+item_id).show();
        $("#div_valor_"+item_id).hide();
        $("#edit_buttons_"+item_id).show();
        $("#update_buttons_"+item_id).hide();
    }

    function updateButton(item_id)
    {
        var item = $("#item_"+item_id).val().trim();
        var qtdmemory = $("#qtdmemory_"+item_id).val().trim();
        var qtddiscos = $("#qtddiscos_"+item_id).val().trim();
        var disco = $("#disco_"+item_id).val().trim();
        var qtd = $("#quantidade_"+item_id).val().trim();
        var interfaces = $("#interfaces_"+item_id).val().trim();
        var componente = $("#componente_"+item_id).val().trim();
        var pool = $("#pool_"+item_id).val().trim();
        var valor = $("#valor_"+item_id).val().trim();
        $.ajax(
            {
                type: "GET",
                url: "/updateitem",
                data: "id="+item_id+"&quantidade="+qtd+"&valor="+valor+"&interfaces="+interfaces+"&qtdmemory="+qtdmemory+"&componente="+componente+"&pool="+pool+"&qtddiscos="+qtddiscos+"&disco="+disco+"&idprojeto="+{{ projeto.id }},
                success: function(data){
                	$("#total_table").empty();
                   	$("#total_table").append(data);
                  	$("#list_items_table").empty();
                   	$("#list_items_table").append(data);
                   	
                   
                   	
//                 	$("#label_item_"+item_id).show();
//                     $("#label_item_"+item_id).text(item);
                    
//                     $("#label_interfaces_"+item_id).show();
//                     $("#interfaces_"+item_id).hide();
//                     $("#label_interfaces_"+item_id).text(interfaces);
                    
//                     $("#label_qtdmemory_"+item_id).show();
//                     $("#qtdmemory_"+item_id).hide();
//                     $("#label_qtdmemory_"+item_id).text(qtdmemory);
                    
//                     $("#label_qtddiscos_"+item_id).show();
//                     $("#qtddiscos_"+item_id).hide();
//                     $("#label_qtddiscos_"+item_id).text(qtddiscos);
                    
//                     $("#label_disco_"+item_id).show();
//                     $("#disco_"+item_id).hide();
//                     $("#label_disco_"+item_id).text(disco);
                    
//                     $("#label_quantidade_"+item_id).show();
//                     $("#quantidade_"+item_id).hide();
//                     $("#label_quantidade_"+item_id).text(qtd);
                    
//                     $("#label_valor_"+item_id).show();
//                     $("#div_valor_"+item_id).hide();
                    
//                     if (valor != '')
//                         $("#label_valor_"+item_id).text(valor);
//                     $("#edit_buttons_"+item_id).show();
//                     $("#update_buttons_"+item_id).hide();
                }
            });
    }

    function removeButton(item_id)
    {
        if (confirm('Deseja realmente deletar o item "'+$("#label_item_"+item_id).text().trim()+'"?')) {
            $.ajax(
                {
                    type: "GET",
                    url: "/removeitemproj",
                    data: "id="+item_id,
                    success: function(data){
                    	 
                      	$("#list_items_table").empty();
                       	$("#list_items_table").append(data);
                         
                    }
                });
        }
    }

    $(document).keyup(function(e)
    {
        if (e.keyCode == 27) {
            $('input[name^="item_"]').hide();
            $('label[id^="label_item_"]').show();
            $('input[name^="quantidade_"]').hide();
            $('label[id^="label_quantidade_"]').show();
            $('div[id^="div_valor_"]').hide();
            $('label[id^="label_valor_"]').show();
            $('div[id^="edit_buttons_"]').show();
            $('div[id^="update_buttons_"]').hide();
        } // ESC pressed
    });

    $(function(){
        $('.real_currency').maskMoney({decimal:'.',thousands:''});
        $('.qtde').mask('99');
        $('.qtdediscos').mask('99');
        $('.memory').mask('9999');
        $('.interfaces').mask('99');
    });
    </script>
    



{% endblock %}
